<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title id="divTitle">创建用户</title>
  <link rel="stylesheet" type="text/css" th:href="@{/css/style.css}" />

  <style type="text/css">
    *, body {
      margin: 0px;
      font-family: '微软雅黑';
    }
  </style>
  <script th:src="@{/js/jquery-1.10.2.min.js}"></script>
  <script th:src="@{/js/jquery.form.js}"></script>
  <script th:src="@{/js/generic.js}"></script>
</head>

<body>
<!--<div th:replace="top :: top"></div>-->
<form id="filePost" method="post" enctype="multipart/form-data" onsubmit="return false;">
  <table class="maintable">
    <tr>
      <td class="rightmaintd" valign="top">
        <div style="width:920px;margin:10px auto;"> <a href="/user/list">&lt;  返回</a> </div>
        <table class="logintable" cellpadding="8" style="margin-top:20px;">
          <tr>
            <td width="100">用户名</td>
            <td><input type="text" id="userid" class="logininput" th:disabled="${_app_edit == 'edit'}"></td>
          </tr>
          <tr>
            <td>姓&nbsp;&nbsp;&nbsp;名</td>
            <td><input type="text" id="username" class="logininput" th:value="${_app_edit == 'edit' ? ${json.user.username} : ''}"></td>
          </tr>
          <tr>
            <td>密&nbsp;&nbsp;&nbsp;码</td>
            <td><input type="password" id="password" class="logininput" th:value="${_app_edit == 'edit' ? ${json.user.password} : ''}"></td>
          </tr>
          <tr>
            <td valign="middle">用户头像</td>
            <td style="padding-left:50px;">
              <img src="/images/userhead.png" id="img" alt="" style="display:block" class="userheadpic"> <br />

              <div class="fileUpload">
                <span id="spSmallImage">上传头像</span>
                <input type="file" id="smallfile" name="smallfile" class="upload" />
                <input type="hidden" id="hidSmallPic" value="" />
              </div>
            </td>
          </tr>
          <tr>
            <td>用户类型</td>
            <td>
              <select id="role" maxlength="50" class="logininput" onchange="searchRole()">
                <option value="1"></option>
                <option th:each="role : ${data}" th:value="${role.id}" th:text="${role.name}"></option>
              </select>
            </td>
          </tr>
          <tr>
            <td>选择团队</td>
            <td>
              <select id="teamName" maxlength="50" class="logininput" onchange="searchTeam()">
                <option value="1"></option>
                <option th:each="team : ${teamData}" th:value="${team.ID}" th:text="${team.TeamName}"></option>
              </select>
            </td>
          </tr>
          <tr>
            <td>联系电话</td>
            <td><input type="text" id="tel" class="logininput" th:value="${_app_edit == 'edit' ? ${json.user.tel} : ''}"></td>
          </tr>
          <tr>
            <td>电子邮箱</td>
            <td><input type="text" id="email" class="logininput" th:value="${_app_edit == 'edit' ? ${json.user.email} : ''}"></td>
          </tr>
          <tr>
            <td>院系单位</td>
            <td><input type="text" id="company" class="logininput" th:value="${_app_edit == 'edit' ? ${json.user.company} : ''}"></td>
          </tr>
          <tr>
            <td>联系地址</td>
            <td><input type="text" id="addr" class="logininput" th:value="${_app_edit == 'edit' ? ${json.user.addr} : ''}"></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td><input type="button" value="保&nbsp;&nbsp;存" class="denglubtn" onclick="saveInfo();"></td>
          </tr>
        </table>
      </td>
    </tr>
  </table>
</form>
<!--<div th:replace="bottom :: bottom"></div>-->

</body>
</html>
<script type="text/javascript">
  var _app_guid = '@ViewBag.Guid';
  var _app_edit = '@ViewBag.EditState';
  var submit = true;
  var roleId = "";
  var roleName = "";
  var teamId = "";
  var teamName = "";

  $(function () {
    //==========角色的下拉========================================
    $.ajax({
      type: 'post',
      dataType: 'json',
      async: true,
      url: '/User/getAllRoleCombobox',
      success: function (data) {
        var len = data.length;
        if (len > 0) {
          $("#role").append('<option value="1"></option>');
          for (var i = 0; i < len; i++) {
            $("#role").append('<option value="' + data[i].id + '">' + data[i].name + '</option>');
          }
        }
        if (_app_edit == "edit") {
          util.getJSON("/User/GetUser", { "id": _app_guid }, function (json) {
            if (json.status == 0) {
              $("#userid").val(json.user.userid);
              $("#username").val(json.user.username);
              $("#img").attr("src", json.user.image);
              set_select_checked("role", json.user.type);
              roleName = json.user.type;
              $("#tel").val(json.user.tel);
              $("#email").val(json.user.email);
              $("#company").val(json.user.company);
              $("#addr").val(json.user.addr);
              roleId = json.roleId;
            }
          });
          $("#divTitle").html("编辑用户");
        } else {
          $("#divTitle").html("创建用户");
        }
      }
    });

    //==========团队的下拉========================================
    $.ajax({
      type: 'post',
      dataType: 'json',
      async: true,
      url: '/User/getAllTeamCombobox',
      success: function (data) {
        var len = data.length;
        if (len > 0) {
          $("#teamName").append('<option value="1"></option>');
          for (var i = 0; i < len; i++) {
            $("#teamName").append('<option value="' + data[i].ID + '">' + data[i].TeamName + '</option>');
          }
        }
        if (_app_edit == "edit") {
          util.getJSON("/User/GetTeam", { "id": _app_guid }, function (json) {
            if (json.status == 0) {
              if (json.type == "名医专家" || json.type == "名医专家+审核者" || json.type == "审核者") {  // 2020-11-2 如果type是名医专家或者名医专家+审核者，则不可改变其团队成员的团队。
                $("#teamName").attr("disabled", true);
              }
              set_select_checked("teamName", json.name);
              teamName = json.name;
              Id = json.Id;
            }
          });
        } else if (_app_edit == "add") {
          util.getJSON("/User/GetCurrentTeam", function (json) {
            if (json.status == 0) {
              if (json.type == "名医专家" || json.type == "名医专家+审核者" || json.type == "审核者") {  // 2020-11-2 如果type是名医专家或者名医专家+审核者，则不可改变其团队成员的团队。
                $("#teamName").attr("disabled", true);
              }
              set_select_checked("teamName", json.name);
              teamName = json.name;
              Id = json.Id;
            }
          })
        }
      }
    });
  });

  function searchRole() {
    roleId = $("#role").find("option:selected").val();
    roleName = $("#role").find("option:selected").text();
  }

  function searchTeam() {
    teamId = $("#teamName").find("option:selected").val();
    teamName = $("#teamName").find("option:selected").text();
  }

  function saveInfo() {
    if ($("#userid").val() == "") {
      alert("请输入用户名");
      $("#userid").focus();
      return;
    }
    if (roleId == "" || roleId == "1") {
      alert("请选择用户类型");
      $("#role").focus();
      return;
    }
    if (_app_edit != "edit" && $("#password").val() == "") {
      alert("请输入密码");
      $("#password").focus();
      return;
    }

    var user = {
      "userid": $("#userid").val(),
      "username": $("#username").val(),
      "password": $("#password").val(),
      "image": $("#hidSmallPic").val(),
      "type": roleName,
      "teamName": teamName,
      "teamID": $("#teamName").val(),
      "tel": $("#tel").val(),
      "email": $("#email").val(),
      "company": $("#company").val(),
      "addr": $("#addr").val()
    };
    var url = _app_edit != "edit" ? "/User/Create" : "/User/Update";

    util.postJson(url, {
      "user": user,
      "roleId": roleId
    }, function (json) {
      if (json.status == 0) {
        alert(json.msg);
        location.href = "/User/List";
      } else {
        alert(json.msg);
      }
    });
  }

  $(function () {
    $("#smallfile").change(function () {
      alert("上传用户头像");
      $("#spSmallImage").html("正在上传");
      $("#filePost").ajaxSubmit({
        url: "/Files/UploadHeader",
        success: function (data) {
          var json = JSON.parse(data);
          if (json.status == 0) {
            $("#hidSmallPic").val(json.msg);
            $("#img").attr("src", "/files/head/" + json.msg);
          } else {
            alert(json.msg);
          }
          $("#spSmallImage").html("上传头像");
        }
      });
    });
  });

  function set_select_checked(selectid, checkText) {
    var select = document.getElementById(selectid);
    for (var i = 0; i < select.options.length; i++) {
      if (select.options[i].text == checkText) {
        select.options[i].selected = true;
        break;
      }
    }
  }
</script>
